/**
 * @param field echarts属性
 * @param chartOption 图表配置
 * @param selectComp 选中的组件
 */
export const echartsMethod = (field: string, chartOption: any, selectComp: any) => {
  const map = {
    'chart-name': () => genChartName(field, chartOption, selectComp),
    'background-color': () => genBackgroundColor(field, chartOption, selectComp),
    'legend': () => genLegend(field, chartOption, selectComp),
    'title': () => genTitle(field, chartOption, selectComp),
    'grid': () => genGrid(field, chartOption, selectComp),
    'axis': () => genAxis(field, chartOption, selectComp),
    'toolbox': () => genToolbox(field, chartOption, selectComp),
    'axis-line': () => genAxisLine(field, chartOption, selectComp),
    'axis-tick': () => genAxisTick(field, chartOption, selectComp),
    'axis-label': () => genAxisLabel(field, chartOption, selectComp),
    'axis-split-line': () => genAxisSplitLine(field, chartOption, selectComp),
    'series': () => genSeries(field, chartOption, selectComp),
  };
  const word = field.replace('x-', '').replace('y-', '');
  if (map[word]) {
    return map[word]();
  } else {
    return chartOption;
  }
};

const genChartName = (field, chartOption, selectComp) => {
  chartOption.series.map(item => {
    item.type = selectComp.chartName;
  });
  return chartOption;
};

const genBackgroundColor = (field, chartOption, selectComp) => {
  chartOption.backgroundColor = selectComp.backgroundColor;
  return chartOption;
};

const genLegend = (field, chartOption, selectComp) => {
  if (selectComp.legend.show) {
    chartOption.legend = selectComp.legend;
  } else {
    delete chartOption.legend;
  }
  return chartOption;
};

const genTitle = (field, chartOption, selectComp) => {
  if (selectComp.title.show) {
    chartOption.title = selectComp.title;
    if (!selectComp.title.subtext) {
      delete chartOption.title.subtext;
      delete chartOption.title.subtextStyle;
    } else {
      chartOption.title.subtextStyle = {
        color: '#000',
        fontSize: 14,
      };
    }
  } else {
    delete chartOption.title;
  }
  return chartOption;
};

const genGrid = (field, chartOption, selectComp) => {
  if (selectComp.grid.show) {
    chartOption.grid = {
      show: true,
      top: selectComp.grid.top + selectComp.gridTUnit,
      left: selectComp.grid.left + selectComp.gridTUnit,
      right: selectComp.grid.right + selectComp.gridTUnit,
      bottom: selectComp.grid.bottom + selectComp.gridTUnit,
      containLabel: true
    };
  } else {
    delete chartOption.grid;
  }
  return chartOption;
};

const genAxis = (field, chartOption, selectComp) => {
  chartOption[getAxis(field)] = {
    ...chartOption[getAxis(field)],
    ...selectComp[getAxis(field)]
  };
  return chartOption;
};

const genToolbox = (field, chartOption, selectComp) => {
  if (selectComp.toolbox.show) {
    chartOption.toolbox = selectComp.toolbox;
  } else {
    delete chartOption.toolbox;
  }
  return chartOption;
};

const genAxisLine = (field, chartOption, selectComp) => {
  if (selectComp[getAxis(field)].axisLine.show) {
    chartOption[getAxis(field)].axisLine = selectComp[getAxis(field)].axisLine;
  } else {
    delete chartOption[getAxis(field)].axisLine;
  }
  return chartOption;
};

const genAxisTick = (field, chartOption, selectComp) => {
  if (selectComp[getAxis(field)].axisTick.show) {
    chartOption[getAxis(field)].axisTick = selectComp[getAxis(field)].axisTick;
  } else {
    delete chartOption[getAxis(field)].axisTick;
  }
  return chartOption;
};

const genAxisLabel = (field, chartOption, selectComp) => {
  if (selectComp[getAxis(field)].axisLabel.show) {
    chartOption[getAxis(field)].axisLabel = selectComp[getAxis(field)].axisLabel;
  } else {
    delete chartOption[getAxis(field)].axisLabel;
  }
  return chartOption;
};

const getAxis = (field) => {
  return field.indexOf('x-') > -1 ? 'xAxis' : 'yAxis';
};

const genAxisSplitLine = (field, chartOption, selectComp) => {
  chartOption[getAxis(field)].splitLine = selectComp[getAxis(field)].splitLine;
  return chartOption;
};

const genSeries = (field, chartOption, selectComp) => {
  chartOption.series.map((item, index) => {
    chartOption.series[index] = {
      ...item,
      ...selectComp.series,
      name: selectComp.series.name + '-' + (index + 1)
    };
  });
  return chartOption;
};
